/*
 * @Author: 肖思汗 
 * @Date: 2025-07-12 16:34:33 
 * @Last Modified by: 肖思汗
 * @Last Modified time: 2025-07-13 15:09:59
 */

import { Button, Space } from '@nutui/nutui-react-taro';
import styles from './GoodsCategory.module.less';
import { GoodsCategoryData } from 'types/type';
import { useEffect, useState } from 'react';
import { autorun, toJS } from 'mobx';
import indexStore from '../indexStore';
import { ReactNode } from 'react';
import { observer } from "mobx-react-lite";
import { useDidShow } from '@tarojs/taro';

interface Iprops {
    children?: ReactNode
}

// 主页的商品分类
const GoodsCategory = observer((props: Iprops) => {

    const scene = toJS(indexStore.scene);

    const all = {
        id: "",
        typeName: "全部",
        level: 1,
        productNumber: 0,
        parentId: 0,
        parentName: "全部",
        status: 0,
        typeIcon: "",
        typeDescribe: "",
        orderNum: 0,
        del: false
    }

    return (
        <Space className={styles.buttonSpace}>
            {[all, ...scene].map((category, index) => (
                <Button
                    key={index}
                    type={category.id == indexStore.activeSecondProductType ? 'primary' : 'default'}
                    className={category.id == indexStore.activeSecondProductType ? styles.selectedButton : styles.unselectedButton}
                    onClick={() => {
                        indexStore.setActiveSecondProductType(String(category.id));
                    }}
                >
                    {category.typeName}
                </Button>
            ))}
        </Space>
    );
});

export default GoodsCategory;

